<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
 <!-- COMPOSE MESSAGE MODAL -->
        <div class="modal fade" id="compose-modal" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title"><i class="fa fa-pencil"></i>申请公告</h4>
                    </div>
                    <form id="addAnnouncementForm" action="${initParam.root}/announcement/mine" method="post">
                        <div class="modal-body">
                            <div class="form-group">
                                <div class="input-group">
                                    <span class="input-group-addon">标题:</span>
                                    <input id="announcementTitle" name="title" type="text" class="form-control" placeholder="例:年初动员大会">
                                </div>
                            </div>
                            <div class="form-group">
                                <textarea id="announcementContext" name="content" class="form-control" placeholder="例:请全体员工到会议室集中" style="height: 120px;"></textarea>
                            </div>
                        </div>
                        <div class="modal-footer clearfix">
                        	<input id="announcementId" name="id" type="hidden"/>
                        	<input id="statusValue" name="status" type="hidden"/>
                            <button id="inboxBtn" type="button" class="btn btn-primary"><i class="fa fa-inbox"></i>存入草拟</button>
                            <button id="sendBtn" type="button" class="btn btn-success pull-left"><i class="fa  fa-arrow-circle-up"></i>提交申请</button>
                        </div>
                    </form>
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->

        <!-- jQuery 2.0.2 -->
        <script src="${initParam.root }/static/js/jquery.min.js"></script>
        <script src="${initParam.root }/static/js/jquery-migrate-1.2.1.js"></script>
        <!-- Bootstrap -->
        <script src="${initParam.root }/static/js/bootstrap.min.js" type="text/javascript"></script>
        <!-- AdminLTE App -->
        <script src="${initParam.root }/static/js/AdminLTE/app.js" type="text/javascript"></script>
        <!-- Bootstrap WYSIHTML5 -->
        <script src="${initParam.root }/static/js/plugins//bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js" type="text/javascript"></script>
        <!-- iCheck -->
        <script src="${initParam.root }/static/js/plugins//iCheck/icheck.min.js" type="text/javascript"></script>
        <!-- Page script -->
        <script type="text/javascript">
            $(function() {

                "use strict";

                //iCheck for checkbox and radio inputs
                $('input[type="checkbox"]').iCheck({
                    checkboxClass: 'icheckbox_minimal-blue',
                    radioClass: 'iradio_minimal-blue'
                });

                //When unchecking the checkbox
                $("#check-all").on('ifUnchecked', function(event) {
                    //Uncheck all checkboxes
                    $("input[type='checkbox']", ".table-mailbox").iCheck("uncheck");
                });
                //When checking the checkbox
                $("#check-all").on('ifChecked', function(event) {
                    //Check all checkboxes
                    $("input[type='checkbox']", ".table-mailbox").iCheck("check");
                });
                //Handle starring for glyphicon and font awesome
                $(".fa-star, .fa-star-o, .glyphicon-star, .glyphicon-star-empty").click(function(e) {
                    e.preventDefault();
                    //detect type
                    var glyph = $(this).hasClass("glyphicon");
                    var fa = $(this).hasClass("fa");

                    //Switch states
                    if (glyph) {
                        $(this).toggleClass("glyphicon-star");
                        $(this).toggleClass("glyphicon-star-empty");
                    }

                    if (fa) {
                        $(this).toggleClass("fa-star");
                        $(this).toggleClass("fa-star-o");
                    }
                });
				$("#inboxBtn").click(function(){
					$("#statusValue").val(0);
					$("#addAnnouncementForm").submit();
				});
				$("#sendBtn").click(function(){
					$("#statusValue").val(1);
					$("#addAnnouncementForm").submit();
				});
				$("#showModal").click(function(){
					$("#addAnnouncementForm").attr("action","${initParam.root}/announcement/mine");
					$("#announcementId").val(0);
					$("#announcementTitle").val("");
					$("#announcementContext").val("");
				});
				$(".info").delegate(".editAnnouncement","click",function(){
					$("#announcementId").val($(this).attr("ref-id"));//id
					$("#announcementTitle").val($(this).attr("ref-title"));//title
					$("#announcementContext").val($(this).attr("ref-content"));//content
					$("#addAnnouncementForm").attr("action","${initParam.root}/announcement/mine-edit");
				});
				$(".info").delegate("tr","mouseover",function(){
					$(this).addClass("unread");
				}).delegate("tr","mouseout",function(){
					$(this).removeClass("unread");
				});
				$(".info").delegate(".announcementInfo","click",function(){
					var id = $(this).attr("ref-id");
					var status =$(this).attr("ref-status");
					location.replace("${initParam.root}/announcement/detail/"+id+"/"+status);
				});
				
                //Initialize WYSIHTML5 - text editor
                //$("#email_message").wysihtml5();
            });
        </script>